import React from 'react'
import Login from "./login"
import Logout from "./logout"
import Content from "./content"
import Footer from "./footer"
import "../../styles/sidebar/index.css"

class Sidebar extends React.Component {
    constructor() {
        super()
        this.state = {
            flag: false,
            item: true
        }
    }

    componentDidMount() {
        let token = localStorage.getItem("token")
        console.log(token)
        if (token) {
            this.setState({
                flag: true
            })
        }
    }

    change() {
        let { method } = this.props
        method(false)
    }

    render() {
        let { flag } = this.state
        return (
            <div>
                <div className="sidebar-wrap" onClick={this.change.bind(this)}>
                </div>
                <div className="sidebar-left">
                    <div className="sidebar-roll">
                        {flag ? <Login /> : <Logout />}
                        <Content />
                    </div>
                    <Footer />
                </div>
            </div>
        )
    }
}

export default Sidebar